import http from '../utils/http'
import constant from '../utils/constant'
import store from '../vuex/mobile'

export default {
  name: 'productDetail',
  data() {
    return {
      msg: 'Welcome to Your Vue.js App',
      vehicleCore: {},
      carSearch: {},
      carDetailData: {},
      vehiclePrices: {},
      country: {},
      rateAmount: {},
      rateAmountType: '',
      form: {
        specialEquipments: [],
        firstName: '',
        lastName: '',
        userPhone: '',
        userEmail: '',
        driveAge: '',
        airportNumber: ''
      },
      successOrder: {}
    }
  },
  methods: {
    fetchOrderDetail: function () {

      // 更新年龄
      this.form.driveAge = this.carSearch.drive_age
      this.carDetailData = {}
      let data = {
        mobile: this.$store.getters.getMobile,
        categoryCode: this.vehicleCore.category_code,
        setId: this.rateAmountType.setId,
        sizeCode: this.vehicleCore.size_code,
        doorCount: this.vehicleCore.door_count,
        airConditionIn: this.vehicleCore.air_condition_in,
        transmissionType: this.vehicleCore.transmission_type,
        modelName: this.vehicleCore.model_name,
        modelCode: this.vehicleCore.model_code,
        picture: this.vehicleCore.picture,
        passengerQuantity: this.vehicleCore.passenger_quantity,
        baggageQuantity: this.vehicleCore.baggage_quantity,
        totalAmount: this.rateAmountType.totalAmount,
        esimatedTotalAmount: this.rateAmountType.esimatedTotalAmount,
        retailAmount: this.rateAmount,
        currencyCode: this.vehicleCore.currency_code,
        rateQualifier: this.vehicleCore.rate_qualifier,
        feeInclude: this.vehicleCore.fee_include_string,
        feeUnInclude: this.vehicleCore.fee_un_include_string,
        includeOrderFeeId: this.vehicleCore.include_order_fee_id_string,
        unIncludeOrderFeeId: this.vehicleCore.un_include_order_fee_id_string,
        vehicleCharge: this.vehicleCore.vehicle_charge_string,
        vehicleChargeId: this.vehicleCore.vehicle_charge_id_string,
        countryId: this.carSearch.country_id,
        supplierId: this.carSearch.supplier_id,
        type: this.carSearch.type,
        pickupLocation: this.carSearch.pickup_location,
        returnLocation: this.carSearch.return_location,
        pickupDate: this.carSearch.pickup_date_time,
        returnDate: this.carSearch.return_date_time,
        driveAge: this.carSearch.drive_age
      }
      http.post(constant.carDetail, data, data => {
        this.carDetailData = data
      })
    },
    submitOrder: function () {
      if (!this.carDetailData) {
        return
      }

      if (this.carDetailData !== undefined && this.form !== undefined) {
        let data = {}
        for (let key of Object.keys(this.carDetailData.carDetail)) {
          let keyArray = key.split('_')
          if (keyArray.length > 1) {
            for (let i = 1; i < keyArray.length; i++) {
              if (keyArray[i].length > 1) {
                let wordArray = keyArray[i].split('')
                wordArray[0] = wordArray[0].toUpperCase()
                keyArray[i] = wordArray.join('')
              }
            }
          }
          let newKey = keyArray.join('')
          data[newKey] = this.carDetailData.carDetail[key]
        }
        for (let key of Object.keys(this.form)) {
          data[key] = this.form[key]
        }
        if (this.form.specialEquipments !== undefined && this.form.specialEquipments.length > 0) {
          data['specialEquipments'] = this.form.specialEquipments.join()
        }
        data.mobile = this.$store.getters.getMobile

        this.$validator.validate().then(valid => {
          if (!valid) {

          } else {
            let loading = this.$message.loading({
              message: '正在提交数据...',
              align: 'center'
            })
            http.post(constant.order, data, data => {
              loading.close()
              this.successOrder = data.order
              let exchangeRate = data.exchangeRate
              this.$router.push({name: 'order-paid', query: {id: this.successOrder.id}})
            }, fail => {
              loading.close()
            })
          }
        })

        // http.post(constant.order, data, data => {
        //   this.successOrder = data.order
        //   let exchangeRate = data.exchangeRate
        //   this.$router.push({name: 'order-paid', query: {id: this.successOrder.id}})
        // })
      }
    },

    goBlack: function() {
      this.$router.go(-1)
    }
  },
  mounted: function () {
    
    if(this.$attrs.vehicleCore) {
      store.dispatch('setVehicleCore', this.$attrs.vehicleCore)
      this.vehicleCore = this.$attrs.vehicleCore
    } else {
      this.vehicleCore = this.$store.getters.getVehicleCore
    }

    if(this.$attrs.carSearch) {
      store.dispatch('setCarSearch', this.$attrs.carSearch)
      this.carSearch = this.$attrs.carSearch
    } else {
      this.carSearch = this.$store.getters.getCarSearch
    }

    if(this.$attrs.carSearch) {
      store.dispatch('setCountry', this.$attrs.country)
      this.country = this.$attrs.country
    } else {
      this.country = this.$store.getters.getCountry
    }

    if(this.$attrs.vehiclePrices) {
      store.dispatch('setVehiclePrices', this.$attrs.vehiclePrices)
      this.vehiclePrices = this.$attrs.vehiclePrices
    } else {
      this.vehiclePrices = this.$store.getters.getVehiclePrices
    }

    if(this.$attrs.ra) {
      store.dispatch('setRateAmount', this.$attrs.ra)
      this.rateAmount = this.$attrs.ra
    } else {
      this.rateAmount = this.$store.getters.getRateAmount
    }
    if (this.$attrs.raType) {
      store.dispatch('setRateAmountType', this.$attrs.raType)
      this.rateAmountType = this.$attrs.raType
    } else {
      this.rateAmountType = this.$store.getters.getRateAmountType
    }

    this.fetchOrderDetail()

    let loading = this.$message.loading({
      message: '正在加载...',
      align: 'center'
    })

    setTimeout(() => {
      loading.close()
    }, 3000);
  },
  watch: {
    form: {
      handler(newValue) {
        this.form.firstName = newValue.firstName.toUpperCase()
        this.form.lastName = newValue.lastName.toUpperCase()
　　　},
　　　deep: true
    },
    '$attrs.vehicleCore'(to, from) {

      if(this.$attrs.vehicleCore) {
        store.dispatch('setVehicleCore', this.$attrs.vehicleCore)  
        this.vehicleCore = this.$attrs.vehicleCore
      } else {
        this.vehicleCore = this.$store.getters.getVehicleCore
      }

      if(this.$attrs.carSearch) {
        store.dispatch('setCarSearch', this.$attrs.carSearch)
        this.carSearch = this.$attrs.carSearch
      } else {
        this.carSearch = this.$store.getters.getCarSearch
      }

      if(this.$attrs.carSearch) {
        store.dispatch('setCountry', this.$attrs.country)
        this.country = this.$attrs.country
      } else {
        this.country = this.$store.getters.getCountry
      }

      if(this.$attrs.vehiclePrices) {
        store.dispatch('setVehiclePrices', this.$attrs.vehiclePrices)
        this.vehiclePrices = this.$attrs.vehiclePrices
      } else {
        this.vehiclePrices = this.$store.getters.getVehiclePrices
      }

      if (this.$attrs.ra) {
        store.dispatch('setRateAmount', this.$attrs.ra)
        this.rateAmount = this.$attrs.ra
      } else {
        this.rateAmount = this.$store.getters.getRateAmount
      }
      if (this.$attrs.raType) {
        store.dispatch('setRateAmountType', this.$attrs.raType)
        this.rateAmountType = this.$attrs.raType
      } else {
        this.rateAmountType = this.$store.getters.getRateAmountType
      }

      this.fetchOrderDetail()
    }
  }

}
